.spec-popup-wrapper {
  box-sizing: border-box;
  position: relative;
  padding-bottom: 24rpx;

  .spec-footer {
    padding: 0 32rpx;
    box-sizing: border-box;

    .confirm-btn {
      line-height: 80rpx;
      height: 80rpx;
      font-size: 32rpx;
      padding: 0 30rpx;
      margin: 0 10rpx;
      border-radius: 60rpx;
      color: #fff;
      background: #C5996A;
      text-align: center;

      &.active {
        opacity: .7;
        transition: opacity .1s ease;
      }
    }
  }

  .spec-number-box {
    padding: 24rpx;
    box-sizing: border-box;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;

    .number-label {
      font-size: 26rpx;
    }

    .action-wrap {
      display: flex;
      align-items: center;

      .number-value {
        width: 60rpx;
        text-align: center;
        font-size: 30rpx;
        color: #222222;
        margin: 0 2rpx;
      }

      .btn-item {
        width: 48rpx;
        height: 48rpx;

        image {
          width: 100%;
          height: 100%;
        }
      }
    }
  }

  .spec-list {
    padding: 24rpx;
    box-sizing: border-box;
    position: relative;

    .spec-item-label {
      padding: 24rpx 0;
      font-size: 26rpx;
      color: #303133;
    }

    .spec-item-wrap {
      display: flex;
      flex-flow: row nowrap;

      .spec-item {
        background: rgba(146, 199, 59, .1);
        padding: 0 24rpx;
        line-height: 54rpx;
        border-radius: 60rpx;
        border: 1rpx solid #f2f2f2;
        margin: 0 20rpx 20rpx 0;
        font-size: 26rpx;
        color: #666666;
        background: #f2f2f2;

        &.active {
          border-color: #C5996A;
          background: #C5996A;
          color: #fff;
        }
      }
    }
  }

  .spec-header {
    display: flex;
    flex-flow: row nowrap;
    justify-content: flex-start;
    align-items: flex-start;
    padding: 24rpx;

    .good-info {
      margin-left: 24rpx;
      box-sizing: border-box;

      .count-wrap {
        margin-top: 10rpx;
        font-size: 26rpx;
        color: #303133;
      }

      .price-wrap {
        display: flex;
        align-items: flex-end;
        color: #C5996A;

        .price-prefix {
          font-size: 28rpx;
          padding-bottom: 2rpx;
        }

        .price-value {
          font-weight: bold;
          font-size: 42rpx;
        }
      }
    }

    .good-img {
      width: 176rpx;
      height: 176rpx;
      border-radius: 5px;
    }
  }
}
